<template>
    <div class="pageheader">
        <el-page-header @back="back">
            <template #content>
                <span> 方案比选 </span>
            </template>
        </el-page-header>
    </div>
    <div style="margin: 20px">
        <el-card>
            <el-table ref="viewTable" :data="tableData" :border="true" highlight-current-row class="dataTable">
                <el-table-column sortable prop="solutionId" label="ID" width="65" fixed="left"></el-table-column>
                <el-table-column sortable prop="name" label="方案名称" width="105" fixed="left">
                    <template v-slot="scope">
                        {{ getNameById(scope.row.solutionId) }}
                    </template>
                </el-table-column>
                <el-table-column sortable prop="31" label="投资总额">
                    <template v-slot="scope">
                        {{ scope.row[31].toFixed(2) + "万元" }}
                    </template>
                </el-table-column>
                <el-table-column sortable prop="32" label="计算期总销售收入">
                    <template v-slot="scope">
                        {{ scope.row[32].toFixed(2) + "万元" }}
                    </template>
                </el-table-column>
                <el-table-column sortable prop="33" label="计算期总成本费用">
                    <template v-slot="scope">
                        {{ scope.row[33].toFixed(2) + "万元" }}
                    </template>
                </el-table-column>
                <el-table-column sortable prop="34" label="税后静态投资回收期">
                    <template v-slot="scope">
                        {{ scope.row[34].toFixed(2) + "年" }}
                    </template>
                </el-table-column>
                <el-table-column sortable prop="35" label="税后动态投资回收期">
                    <template v-slot="scope">
                        {{ scope.row[35].toFixed(2) + "年" }}
                    </template>
                </el-table-column>
                <el-table-column sortable prop="36" label="FIRR">
                    <template v-slot="scope">
                        {{ (scope.row[36] *100).toFixed(2) + "%" }}
                    </template>
                </el-table-column>
                <el-table-column sortable prop="37" label="FNPV">
                    <template v-slot="scope">
                        {{ scope.row[37].toFixed(2) + "万元" }}
                    </template>
                </el-table-column>
                <!-- 方案比选功能暂无 -->
                <!-- <el-table-column prop="selection" label="选择方案" fixed="right" width="120">
                    <template v-slot="scope">
                        <el-button size="small" @click="selectBest(scope.row)">选择方案</el-button>
                    </template>
                </el-table-column> -->
            </el-table>
        </el-card>
    </div>
</template>
<script lang="ts" setup>
import { ElMessage, formContextKey } from 'element-plus';
import solutionApi from "@/api/generic/solution";
import { reactive, ref } from 'vue';
import router from "@/router";

const tableData = ref([])
const solutionMap = ref({} as any)
const notEmpty = ref(false)
// 获取方案比选结果
const getCompare = (ids: Array<number>) => {
    solutionApi.compare(ids).then((res) => {
        console.log(res)
        tableData.value = res.data.data
    })
}

// 回退
const back = () => {
    router.push("/generic/solution");
};

// 根据方案id获取方案名称
const getNameById = (id: string) => {
    return solutionMap[id]
}

// 选择最佳方案生成报告
const selectBest = (solution: any) => {
    console.log(solution)
    window.sessionStorage.setItem("genericBest", JSON.stringify(solution.solutionId))
    router.push("/generic/report")
}

// 进行渲染
const geneCompare = window.sessionStorage.getItem("genericCompare")
if (geneCompare === null) {
    ElMessage.error("尚未选择比选方案！")
    notEmpty.value = false;
} else {
    notEmpty.value = true;
    const solutionList = JSON.parse(geneCompare)
    const ids = []
    for (const item of solutionList) {
        ids.push(item.id)
        solutionMap[item.id] = item.name
    }
    getCompare(ids)
}
</script>